<style scoped lang="less">
.playlist {
  box-sizing: border-box;
  width: 100%;
  height: calc(100% - 105px);
  padding: 10px 20px;
}
</style>
<template>
  <div class="playlist" ref="playlistRef">
    <HighQuality :category="category"/>
    <FilterBox v-model:value="category" :el="playlistRef"/>
    <ListBox :category="category" :el="playlistRef"/>
  </div>
  <ScrollBar :el="playlistRef" :grain="1"></ScrollBar>
</template>

<script lang="ts" setup>
// 资源
import ScrollBar from '@/components/scrollBar'
import HighQuality from '../modules/playlist/highquality.vue'
import FilterBox from '../modules/playlist/filterBox.vue'
import ListBox from '../modules/playlist/listBox.vue'
import { AxiosService } from '@/core'
import {computed, ref} from "vue";

const category = ref(null) // 歌单类型
const playlistRef = ref(null)
// todo 数据

</script>

